<template>
  <div class="page2">
    <van-empty v-if="!approvalList.length && !noticeList.length && !fileList.length" description="暂无数据" />
    <div v-else class="content">
      <div class="record-list">
        <div class="record-title">施工图审查(审图机构)</div>
        <div v-for="(item,index) in approvalList" :key="index" class="record-item">
          <div class="label">序号：{{ index + 1 }}</div>
          <div class="label">办理环节：{{ item.handlingLink }}</div>
          <div class="label">办理处室：{{ item.handlingDepartment }}</div>
          <div class="label">办理人：{{ item.handlingPersonal }}</div>
          <div class="label">办理意见：<span :style="{ color: true ? '#1EA95C' : 'red'}">{{ item.handlingOpinion }}</span></div>
          <div class="label">办理时间：{{ item.handlingTime }}</div>
        </div>
      </div>
      <div class="record-list" style="margin: 20px 0">
        <div class="record-title">事项批复文件</div>
        <div v-for="(item,index) in fileList" :key="index" class="record-item">
          <div class="label">批复标题：{{ item.itemTitle }}</div>
          <div class="label">批复文号：{{ item.documentNo }}</div>
          <div class="label">批复文件：{{ item.file }}</div>
          <div class="label">批复意见：<span :style="{ color: true ? '#1EA95C' : 'red'}">{{ item.itemOpinion }}</span></div>
          <div class="label">批复日期：{{ item.itemDate }}</div>
        </div>
      </div>
      <div class="record-list">
        <div class="record-title">通知</div>
        <div v-for="(item,index) in noticeList" :key="index" class="record-item">
          <div class="label">通知书名称：{{ item.noticeName }}</div>
          <div class="label">通知书日期：{{ item.noticeDate }}</div>
          <div class="label">操作：<span style="color: #2A84E9">点击下载</span></div>
        </div>
      </div>
    </div>
  </div>
</template>

<script>
import { http_project_node } from '@/api'

export default {
  name: 'ProjectHandleProcess',
  data() {
    return {
      approvalList: [],
      noticeList: [],
      fileList: []
    }
  },
  created() {
    this.getList()
  },
  methods: {
    getList() {
      http_project_node.page({
        id: this.$route.query.id,
        status: this.$route.query.status,
        intermediaryId: this.$route.query.intermediaryId
      }).then(res => {
        this.approvalList = res.data.approval || []
        this.fileList = res.data.files || []
        this.noticeList = res.data.notice || []
      })
    }
  }
}
</script>

<style scoped lang="scss">
.page2 {
    .content{
        padding: 20px;
        .record-list {
            width: 100%;
            background: #FFFFFF;
            border-radius: 10px;
            padding: 20px;
            .record-title {
                height: 16px;
                font-size: 16px;
                font-family: PingFang SC;
                font-weight: bold;
                color: #333333;
                line-height: 16px;
                margin-bottom:22px;
            }
            .record-item {
                .label {
                    height: 13px;
                    font-size: 14px;
                    font-family: PingFang SC;
                    font-weight: 500;
                    color: #333333;
                    line-height: 13px;
                    margin-bottom: 17px;
                }
                border-bottom: 1px solid #D1D1D1;
            }
        }
    }
}
</style>
